import { STORAGE_MODES } from '@/enum/modules/indicator'
import type { DatePickType } from 'element-plus'
import { dayjs } from 'element-plus'

export function useTimeTypeFormat() {
  const timeType = ref(STORAGE_MODES.DAY)
  const dataTime = ref(dayjs().format('YYYY-MM-DD'))
  const pickerType = computed<DatePickType>(() => {
    switch (timeType.value) {
      case STORAGE_MODES.YEAR:
        return 'year'
      case STORAGE_MODES.MONTH:
        return 'month'
      default:
        return 'date'
    }
  })
  const pickerFormat = computed(() => {
    switch (timeType.value) {
      case STORAGE_MODES.DAY:
        return 'YYYY-MM-DD'
      case STORAGE_MODES.MONTH:
        return 'YYYY-MM'
      case STORAGE_MODES.YEAR:
        return 'YYYY'
      default:
        return 'YYYY-MM-DD'
    }
  })

  watchEffect(() => {
    switch (timeType.value) {
      case STORAGE_MODES.DAY:
        dataTime.value = dayjs(dataTime.value).format('YYYY-MM-DD')
        break
      case STORAGE_MODES.MONTH:
        dataTime.value = dayjs(dataTime.value).format('YYYY-MM')
        break
      case STORAGE_MODES.YEAR:
        dataTime.value = dayjs(dataTime.value).format('YYYY')
        break
      default:
    }
  })

  return {
    timeType,
    dataTime,
    pickerType,
    pickerFormat,
  }
}
